<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" type="text/css" href="../../css/style.css" />
		<link rel="stylesheet" type="text/css" href="../../css/demo.css" />
		<script src="../../js/demo.js" type="text/javascript" charset="utf-8"></script>
		<title>购物车</title>
	</head>
	<body>
		<!--header-->
		<div class="header">
			<div class="header-content">
				<ul class="nav left">
					<li><img src="../../img/regist-arrow.png" /></li>
					<li class="nav-one">
						<a href="javascript:history.go(-1);">返回</a>
					</li>
					<li class="nav-two">
						<a href="../../index.html">关闭</a>
					</li>
				</ul>
				<p class="left">购买确认</p>
				<div class="right nav_right">
					<img src="../../img/regist-list.png" />
				</div>
			</div>
		</div>
		<!--main-->
		<div class="main clear">
	    </div>
	    <div class="static-img">
		    <img src="../../img/regist-back.png"/>
		</div>
		<div class="static-img2">
			<img src="../../img/interface-icon3.png"/>
		</div>
		
		<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
		<script type="text/javascript">
			selectUserAddressById()
			//显示用户默认收货地址
			function selectUserAddressById(){
				$.ajax({
					type:"post",
					url:"/qiaomengapp/shopping-cart/api/selectUserAddressById",
					dataType:"json",
					success:function(data){
						$(".main").append("<div class='interface' userAddressId='"+data.id+"'>"+
								"<div class='interfacelist'>"+
								"<p>收货人：<span class='ling' username>"+data.username+"</span> <span class='interface-tel' phone >"+data.phone+"</span></p>"+
								"<div class='interfacelist-text'>"+
									"<a href='javascript:;' class='left'>[默认地址]</a>"+
									"<p class='left'>"+data.address+"</p>"+
									"<img src='../../img/interface-icon2.png' style='width: 0.13rem;height: 0.23rem;' class='right'/>"+
								"</div>"+
							"</div>"+
						"</div>"+
						"<div style='margin: auto;width: 6.38rem;margin-top: -0.1rem;' class='clear'>"+
						"<img src='../../img/interface-icon4.png' style='width: 6.38rem;height: 0.1rem;'/>"+
						"</div>"+
						"<form action=''>"+
						"</form>");
						
						//显示购物车中的商品
						showBuyGoodMessage();
					}
				});
			}
			
			function showBuyGoodMessage(){
				var queryData =location.search;
				$.ajax({
					type:'get',
					url:"/qiaomengapp/shopping-cart/api/showBuyGoodMessage",
					data:queryData.substring(1,queryData.length),
					dataType:'json',
					success:function(data){
						/* 是否显示结算按钮 */
						var flag = false;
						for ( var key in data) {
							flag=true;
						$('form').html($('form').html()+"<div class='interface2'>"+
							"<div class='interfacelist2' shopId='"+data[key][0].shopId+"'>"+key+
								"<img src='../../img/shopcouple-icon7.png'/>"+
								"<img src='../../img/interface-icon2.png' style='width: 0.13rem;height: 0.23rem;'/>"+
							"</div>"+
						"</div>");
							var data2=data[key];
							for ( var i in data2) {
								var shopGood=data2[i];
								$('form').html($('form').html()+"<div class='interface3'>"+
										"<div class='interfacelist3'>"+
										"<img src='../../imgs/interface-icon9.jpg' class='left'/>"+
										"<img class='left' src='../../img/interface-icon8.png' style='width: 0.37rem;height: 0.37rem;vertical-align: top;margin-left: 0.2rem;'/>"+
										"<ul class='interfacelist3-content right'>"+
											"<li class='interface3-one'>"+shopGood.goodDesc+"</li>"+
											"<li class='interface3-two'>颜色："+shopGood.colorName+"；</li>"+
											"<li class='interface3-thr' shopGoodId='"+shopGood.shopGoodId+"' price='"+shopGood.price+"'>￥"+shopGood.price+"</li>"+
											"<li class='interface3-fou right' shopGoodId='"+shopGood.shopGoodId+"' showNum>×1</li>"+
										"</ul>"+
									"</div>"+
								"</div>"+
								"<div class='interface4'>"+
									"<ul class='interfacelist4'>"+
										"<li class='interface4-textone'>"+
											"<p class='left'>购买数量</p>"+
											"<div class='right'>"+
												"<img src='../../img/interface-icon11.png' onclick='changeGoodNum()'/>"+
												"<span shopId='"+shopGood.shopId+"' shopGoodId='"+shopGood.shopGoodId+"' num>1</span>"+
												"<img src='../../img/interface-icon12.png' onclick='changeGoodNum()'/>"+
											"</div>"+
										"</li>"+
										"<li class='interface4-textone'>"+
											"<p class='left'>配送方式</p>"+
											"<div class='right'>"+
												"<span>快递 免邮</span>"+
												"<img src='../../img/interface-icon2.png' style='width: 0.13rem;height: 0.23rem;vertical-align: text-top;'/>"+
											"</div>"+
										"</li>"+
										"<li class='interface4-textone'>"+
											"<p class='left'>买家留言：</p>"+
											"<div class='right'>"+
												"<input type='text' name='leaving-msg' id='' shopId='"+shopGood.shopId+"' msg value='' placeholder='选填，可填写您和卖家达成一致的要求'/>"+
											"</div>"+
										"</li>"+
										"<li class='interface4-textone' style='border-bottom: none;'>"+
											"<p class='left' style='margin-top: 0.15rem;'>合计：</p>"+
											"<span class='interface4-red' shopId='"+shopGood.shopId+"' billPrice>￥"+shopGood.price+"</span>"+
										"</li>"+
									"</ul>"+
								"</div>");
							}
						}
						if(flag){
						/* 添加确认按钮  */
						$('form').html($('form').html()+"<input type='button' value='确定' id='interface-sure' onclick='createBill()'/>");
						}else{
							alert("选择的商品不存在！");
							location="shopcar-purchase.html";
						}
					}
				});
			}
			
			/* 改变购买商品的数量  */
			function changeGoodNum(){
				var $img=$(event.target);
				/* 判断是加还是减  */
				var src = $img.attr("src");
				/* 得到显示数量的标签对象  */
				var $span = $img.siblings("span");
				/* 得到数量对应的shopGoodId  */
				var shopGoodId = $span.attr("shopGoodId");
				/* 增加数量  */
				if(src=="../../img/interface-icon12.png"){
					var num = $span.html()-0+1;
					$("[shopGoodId='"+shopGoodId+"']").each(function(index,element){
						//判断是显示还是提交数量
						var $element=$(element);
						if($element.attr("showNum")!=undefined){
							$element.html("×"+num);
						}else if($element.attr("num")!=undefined){
							$element.html(num);
						}
					});
				}else{
					var num = 1;
					if(( $span.html()-0)>1){
						num = $span.html()-0-1;
					}
					$("[shopGoodId='"+shopGoodId+"']").each(function(index,element){
						//判断是显示还是提交数量
						var $element=$(element);
						if($element.attr("showNum")!=undefined){
							$element.html("×"+num);
						}else if($element.attr("num")!=undefined){
							$element.html(num);
						}
					});
				}
				billPrice();
			}
			
			/* 计算订单价格  */
			function billPrice(){
				$("div[shopId]").each(function(index,element){
					var $element=$(element);
					var shopId=$element.attr("shopId");
					//记录订单价格
					var billPrice = 0;
					//根据shopId查询商品种类和数量
					$("[shopId='"+shopId+"'][num]").each(function(index2,element2){
						var $element2=$(element2);
						//得到商品数量
						var num = $element2.html();
						//得到shopGoodId
						var shopGoodId=$element2.attr("shopGoodId");
						//得到商品价格
						var price = $("[shopGoodId='"+shopGoodId+"'][price]").attr("price");
						billPrice+=(price-0)*(num-0);
					});
					$("[shopId='"+shopId+"'][billPrice]").html("￥"+billPrice);
				});
			}
			
			/* 创建订单   */
			function createBill(){
				//参数对应的字符串
				var dataStr = "1=1";
				//每一个shopId对应一张订单 
				$("div[shopId]").each(function(index,element){
					var $element = $(element);
					//得到shopId
					var shopId = $element.attr("shopId");
					dataStr+="&billAndBillGoods["+index+"].bill.shopId="+shopId;
					//得到买家留言
					var msg=$("[shopId='"+shopId+"'][msg]").val();
					dataStr+="&billAndBillGoods["+index+"].bill.restMsg="+msg;
					//买家收货地址
					var sendUserAddressId = $(".interface[userAddressId]").attr("userAddressId");
					dataStr+="&billAndBillGoods["+index+"].bill.sendUserAddressId="+sendUserAddressId;
					
					//订单商品
					$("[shopId='"+shopId+"'][num]").each(function(index2,element2){
						var $element2=$(element2);
						//得到商品数量
						var num=$element2.html();
						dataStr+="&billAndBillGoods["+index+"].billGoods["+index2+"].num="+num;
						//得到商品id
						var shopGoodId = $element2.attr("shopGoodId");
						dataStr+="&billAndBillGoods["+index+"].billGoods["+index2+"].shopGoodId="+shopGoodId;
						//得到商品价格
						var price=$("[shopGoodId='"+shopGoodId+"'][price]").attr("price");
						dataStr+="&billAndBillGoods["+index+"].billGoods["+index2+"].price="+price;
					});
				});
				//创建订单
				 $.ajax({
					type:"post",
					url:"/qiaomengapp/bill/api/createBill",
					data:dataStr,
					success:function(data){
						var result = eval("("+data+")");
						if(result.success!=undefined){
							alert(result.success);
							location="/qiaomengapp/";
						}else if(result.errro!=undefined){
							alert(result.error);
						}
					}
				});
			}
			
		</script>
		
	</body>
	
</html>